<!--党务办统计搜索-->
<template>
  <div class="mui-pages" style="background-color: #fff;">
    <header class="mui-bar mui-bar-nav flex-between-center">
      <div @click="fn.back()" class="mui-action-back"><img class="back-btn" src="../../../../static/images/back.png"></div>
      <div class="header-search keyworld-search">
        <i class="search-icon"></i>
        <input type="search" name="" placeholder="请输入关键词搜索" v-model="keywords">
      </div>
    </header>
    <div class="organization-tab mui-segmented-control flex-justify-start">
      <a class="mui-control-item" @click="jump(1)" :class="{'mui-active':type==1}" href="javascript:void(0)">党员学习统计</a>
      <a class="mui-control-item" @click="jump(2)" :class="{'mui-active':type==2}" href="javascript:void(0)">答题情况统计</a>
    </div>
    <div class="mui-scroll-wrapper mui-page-content mui-pages">
      <div class="mui-scroll-wrapper">
        <div class="mui-scroll">
          <!-- --------党员学习统计---------------start -->
          <studySearchStudyComponent v-if="type==1" :key="keywords" :initKeywords="keywords"></studySearchStudyComponent>
          <!-- --------党员学习统计---------------end -->
          <!-- --------答题情况统计---------------start -->
          <studySearchAnswerComponent v-if="type==2" :key="keywords" :initKeywords="keywords"></studySearchAnswerComponent>
          <!-- --------答题情况统计---------------end -->
        </div>
      </div>
    </div>
  </div>
</template>

<script>
  import studySearchStudyComponent from './studySearchStudyComponent'
  import studySearchAnswerComponent from './studySearchAnswerComponent'
  import tools from '@/utils/tools'
  export default {
    components: {
      studySearchStudyComponent,
      studySearchAnswerComponent
    },
    name: 'studySearch',
    data () {
      return {
        fn: tools,
        options: {
          pullUpLoad: true,
          scrollbar: false
        },
        isFinished: -1,
        type: 1, // 1:党员学习，2：答题情况
        tabIndex: 1,
        objectsName: '',
        swipeData: [],
        infinite: true,
        pageIndex: 0,
        refresh: 0,
        keywords: ''
      }
    },
    created () {
      this.type = this.$route.params.type
      console.log(this.type)
    },
    methods: {
      jump (type) {
        this.$router.replace({path: '/studySearch/' + type})
      },
      highLight (key, str) {
        let searchReg = new RegExp(`${key}`, 'g')
        let searchReplace = `<span class="text-red">${key}</span>`
        // 标红字体
        if (this.keyword.length > 0) {
          return str.replace(searchReg, searchReplace)
        }
        return str
      }
    },
    watch: {
      keywords (newValue, oldValue) {
        this.refresh = Date.now()
      },
      $route (to, from) {
        this.type = to.params.type
      }
    }
  }
</script>

<style scoped lang="scss">
  .screen-btn {
    /*margin-bottom: 80px;*/
  }
  .aside-menu.mui-off-canvas-right {
    z-index:999;
    visibility:visible;
  }
</style>
